<template>
	<view style="padding: 30rpx;">
		<view style="font-weight: 500;" class="mt-20">
			注册
		</view>

		<!-- 输入框 -->
		<view class="uni-form-item uni-column mt-40 pb-10">
			<view class="uni-input-wrapper">
				<input class="uni-input" type="number"  focus @input="changeUserName" :maxlength='11' placeholder="请输入手机号" />
			</view>
		</view>
		<view class="divider" />
		<view class="uni-form-item uni-column mt-40 pb-10 flex center">
			<view class="uni-input-wrapper flex1">
				<input class="uni-input" type="number" placeholder="请输入6~16位密码" :maxlength='16' :password='showPassword' @input="changePassword" />
			</view>
			<uni-icons type="eye-slash-filled" @click='changeShowPassword' v-if='showPassword' color='#EF3D22'></uni-icons>
			<uni-icons type="eye-filled" @click='changeShowPassword' v-else color='#EF3D22'></uni-icons>
		</view>
		<view class="divider" />

		<view class="login bg_linear f32 mt-60" @click="register()">
			注册
		</view>

		<!-- 微信登录 -->
		<!-- #ifdef APP-PLUS || MP-WEIXIN -->
		<view class="wxLogin" @click="navToPage(`/pages/login/wxLogin`,'','redirectTo')">
			<uni-icons type="weixin" size='28' color='#62b900'></uni-icons>
		</view>
		<!-- #endif -->

	</view>
</template>

<script>
	export default {
		data() {
			return {
				userName: '', //账号	
				password: '', //密码
				showPassword: true, //密码是否展示
			}
		},
		onLoad() {
			var _this = this;
		},

		methods: {

			//账号输入
			changeUserName(event) {
				this.userName = event.detail.value
			},
			//密码输入
			changePassword(event) {
				this.password = event.detail.value
			},
			//是否明文显示密码
			changeShowPassword() {
				this.showPassword = !this.showPassword;
			},
			//登录
			register() {
				let params = {
					user_name: this.userName,
					password: this.password
				}
				console.log(111);
				this.$http.post(this.$api.user.register, params).then(res => {
					console.log(res.data);
					if (res.code == 200) {
						uni.showToast({
							title: '注册成功',
							icon: 'none',
							duration: 2000,
						});
						setTimeout(() => {
							uni.setStorageSync('storage_key',res.data.key);
							uni.navigateBack();
						}, 500);

					} else {
						uni.showToast({
							title: res.msg,
							icon: 'none',
							duration: 2000,
						});
					}

				}).catch(err => {

				})
			}
		}
	}
</script>

<style lang="scss">
	.login {
		width: 100%;
		border-radius: 15px;
		color: #FFFFFF;
		text-align: center;
		padding: 14rpx 0;
	}

	.wxLogin {
		position: absolute;
		bottom: 30px;
		width: calc(100% - 60rpx);
		text-align: center;
	}
</style>
